import React, { useState, createContext, useContext } from 'react'

const CountContext = createContext()

function Counter() {
  const count = useContext(CountContext)
  return <h2>{count}</h2>
}

export default function Example4() {
  const [count, setCount] = useState(0)
  return (
    <>
      <p>You clicked {count} times</p>
      <button
        onClick={() => {
          setCount(count + 1)
        }}>
        click me
      </button>
      <CountContext.Provider value={count}>
        <Counter />
      </CountContext.Provider>
    </>
  )
}
